<!DOCTYPE html>
<html lang="en">
	<head>
		 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	    <meta charset="utf-8">
	    <meta http-equiv="X-UA-Compatible" content="IE=edge">
	    <meta name="viewport" content="width=device-width, initial-scale=1">
	    <meta name="description" content="">
	    <meta name="author" content="">
		<title>Login</title>
		<link rel="stylesheet" type="text/css" href="<?php echo base_url();?>public/css/bootstrap.css">
		<style type="text/css">
			body, html {
			    height: 100%;
			    background-repeat: no-repeat;
			    background-image: url("<?php echo base_url(); ?>public/img/background.jpg") ;
			    background-repeat: no-repeat;
			    background-position: center;
			    background-size: cover;
			    width: 100%;
			    height: 100%;
			   /* linear-gradient(rgb(104, 145, 162), rgb(12, 97, 33)*/
			}

				.card-container.card {
				    width: 350px;
				    padding: 40px 40px;
				}

				.btn {
				    font-weight: 700;
				    height: 36px;
				    -moz-user-select: none;
				    -webkit-user-select: none;
				    user-select: none;
				    cursor: pointer;
				}

			/*
			 * Card component
			 */
				.card {
				    background-color: #F7F7F7;
				    /* just in case there no content*/
				    padding: 20px 25px 30px;
				    margin: 0 auto 25px;
				    margin-top: 50px;
				    /* shadows and rounded borders */
				    -moz-border-radius: 2px;
				    -webkit-border-radius: 2px;
				    border-radius: 2px;
				    -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
				    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
				    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
				}

				.profile-img-card {
				    width: 96px;
				    height: 96px;
				    margin: 0 auto 10px;
				    display: block;
				    -moz-border-radius: 50%;
				    -webkit-border-radius: 50%;
				    border-radius: 50%;
				}

			/*
			 * Form styles
			 */
				.profile-name-card {
				    font-size: 16px;
				    font-weight: bold;
				    text-align: center;
				    margin: 10px 0 0;
				    min-height: 1em;
				}

				.reauth-email {
				    display: block;
				    color: #404040;
				    line-height: 2;
				    margin-bottom: 10px;
				    font-size: 14px;
				    text-align: center;
				    overflow: hidden;
				    text-overflow: ellipsis;
				    white-space: nowrap;
				    -moz-box-sizing: border-box;
				    -webkit-box-sizing: border-box;
				    box-sizing: border-box;
				}

				.form-signin #inputEmail,
				.form-signin #inputPassword {
				    direction: ltr;
				    height: 44px;
				    font-size: 16px;
				}

				.form-signin input[type=email],
				.form-signin input[type=password],
				.form-signin input[type=text],
				.form-signin button {
				    width: 100%;
				    display: block;
				    margin-bottom: 10px;
				    z-index: 1;
				    position: relative;
				    -moz-box-sizing: border-box;
				    -webkit-box-sizing: border-box;
				    box-sizing: border-box;
				}

				.form-signin .form-control:focus {
				    border-color: rgb(104, 145, 162);
				    outline: 0;
				    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgb(104, 145, 162);
				    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgb(104, 145, 162);
				}

				.btn.btn-signin {
				   
				    padding: 0px;
				    font-weight: 700;
				    font-size: 14px;
				    height: 36px;
				    -moz-border-radius: 3px;
				    -webkit-border-radius: 3px;
				    border-radius: 0px;
				    border: none;
				    -o-transition: all 0.218s;
				    -moz-transition: all 0.218s;
				    -webkit-transition: all 0.218s;
				    transition: all 0.218s;
				}
				.forgot-password {
				    color: rgb(104, 145, 162);
				}

				

		</style>
		
		
	</head>
	<body>

		 <div class="container">
        <div class="card card-container">
            
            <img id="profile-img" class="profile-img-card" src="//ssl.gstatic.com/accounts/ui/avatar_2x.png" />
            <p id="profile-name" class="profile-name-card"></p>
            	<?php echo form_open("login",'class="form-signin"'); ?>
                <span id="reauth-email" class="reauth-email"></span>
                <input type="text" name="username" id="inputEmail" class="form-control" placeholder="User Name" value="<?php echo set_value("username"); ?>" required>
                <span class="error_sms"><?php echo form_error('username'); ?></span>
                <input type="password" name="password" id="inputPassword" class="form-control" placeholder="Password" required>
                <span class="error_sms"><?php echo form_error('password'); ?></span>
                <div id="remember" class="checkbox">
                    <label>
                        <input type="checkbox" name="remember" value="remember-me"> Remember me
                    </label>
                </div>
                <button class="btn btn-lg btn-primary btn-block btn-signin" type="submit">Sign in</button>
                <?php echo form_close(); ?>
            <a href="#" class="forgot-password">
                Forgot the password?
            </a>
        </div><!-- /card-container -->
    </div><!-- /container -->
	</body>
</html>